import React, { useRef } from 'react';
import { Button, message } from 'antd';
import { ProFormInstance, ProFormTextArea } from '@ant-design/pro-form';
import ProForm, {
  DrawerForm,
  ProFormText,
  ProFormDateRangePicker,
  ProFormSelect,
} from '@ant-design/pro-form';
import { PlusOutlined } from '@ant-design/icons';
import { insertUsingPOST1 } from '@/services/test/Post';

type AddDrawerProps = {
  onChange: () => void;
};

// export default () => {
const AddDrawer: React.FC<AddDrawerProps> = (props) => {
  const { onChange } = props;
  const formRef = useRef<ProFormInstance>();

  return (
    <DrawerForm<{
      name: string;
      start_time: string;
      startTime: string;
      deadline: string;
      college: string;
      number: number;
    }>
      title="新建计划"
      formRef={formRef}
      trigger={
        <Button type="primary">
          <PlusOutlined />
          新建招聘计划
        </Button>
      }
      width="550px"
      autoFocusFirstInput
      drawerProps={{
        destroyOnClose: true,
      }}
      onFinish={async (values) => {
        console.log(values);
        await insertUsingPOST1({
          ...values,
          valid: false,
          deadline: values.start_time[1] + 'T00:00:00',
          startTime: values.start_time[0] + 'T00:00:00',
        });
        onChange();
        message.success('提交成功');
        // 不返回不会关闭弹框
        return true;
      }}
    >
      <ProForm.Group>
        <ProFormText
          name="name"
          width="md"
          tooltip="最长为 24 位"
          label="岗位名称"
          placeholder="请输入岗位名称"
        />
        <ProFormSelect
          options={[
            {
              value: '纺织服装学院',
              label: '纺织服装学院',
            },
            {
              value: '信息与控制学院',
              label: '信息与控制学院',
            },
            {
              value: '经济管理学院',
              label: '经济管理学院',
            },
            {
              value: '艺术与设计学院',
              label: '艺术与设计学院',
            },
            {
              value: '人文与国际交流学院',
              label: '人文与国际交流学院',
            },
            {
              value: '建筑工程学院',
              label: '建筑工程学院',
            },
            {
              value: '后勤类',
              label: '后勤类',
            },
          ]}
          width="md"
          name="college"
          label="所属学院"
        />
      </ProForm.Group>
      <ProForm.Group>
        <ProFormText width="xs" name="number" label="招聘人数" placeholder="请输入" />
        <ProFormDateRangePicker name="start_time" label="招聘起止时间" />

        {/* <ProFormText width="xs" name="old" label="年龄" placeholder="请输入" /> */}
      </ProForm.Group>
      <ProForm.Group>
        <ProFormSelect
          options={[
            {
              value: '博士研究生/博士后',
              label: '博士研究生/博士后',
            },
            {
              value: '硕士研究生',
              label: '硕士研究生',
            },
            {
              value: '大学本科',
              label: '大学本科',
            },
            {
              value: '大学专科',
              label: '大学专科',
            },
            {
              value: '职业高中',
              label: '职业高中',
            },
            {
              value: '技校',
              label: '技校',
            },
            {
              value: '高中',
              label: '高中',
            },
            {
              value: '中专',
              label: '中专',
            },
            {
              value: '初中及以下',
              label: '初中及以下',
            },
            {
              value: '不限',
              label: '不限',
            },
          ]}
          width="sm"
          name="education"
          label="最高学历"
        />
        <ProFormSelect
          options={[
            {
              value: '名誉博士',
              label: '名誉博士',
            },
            {
              value: '博士',
              label: '博士',
            },
            {
              value: '硕士',
              label: '硕士',
            },
            {
              value: '学士',
              label: '学士',
            },
            {
              value: '双学位博士',
              label: '双学位博士',
            },
            {
              value: '双学位硕士',
              label: '双学位硕士',
            },
            {
              value: '双学位学士',
              label: '双学位学士',
            },
            {
              value: '无',
              label: '无',
            },
          ]}
          width="sm"
          name="degree"
          label="最高学位"
        />
      </ProForm.Group>
      <ProForm.Group>
        <ProFormTextArea width="xl" name="description" label="职位描述" />
        <ProFormTextArea width="xl" name="require" label="职位要求" />
      </ProForm.Group>
    </DrawerForm>
  );
};

export default AddDrawer;
